<template>
    <div class="head">
      <div class="logo">
        <img src="../assets/大logo.png" alt="HarSine" />
      </div>
      <div class="line">
          <!-- <span @click="login">登录</span> -->
          <router-link to="/Login">登录</router-link>
          <router-link to="/Register">注册</router-link>
          <router-link to="/">主页</router-link>
          <router-link to="/">功能</router-link>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    methods:{
      login() {
        this.$router.push({
          path:'/Login'
        })
      }
    }
  };
  </script>
  
  <style scoped>
  .head {
    padding: 20px 0;
    width: 100%;
    color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
  }
  .head {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .logo {
    width: 50%;
    height: 100%;
    display: flex;
  }
  .logo img {
    margin: auto;
  }
  
  .line {
    width: 50%;
    height: 100%;
  }
  .line {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    
  }
  .line a {
    width: 100px;
    text-decoration: none;
    color: #313131;
  }
  .line a:first-child {
    margin-left: 150px;
  }
  </style>